<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>{{ script_name }} - 文件管理</title>
    <link rel="stylesheet" href="{{ url_for('static', filename='css/common.css') }}">
    <link rel="stylesheet" href="{{ url_for('static', filename='css/index.css') }}">
    <link rel="stylesheet" href="{{ url_for('static', filename='css/manage-files.css') }}">
</head>
<body>
    <div class="header-nav">
        <h1>{{ script_name }} - 文件管理</h1>
        <div class="nav-links">
            <a href="{{ url_for('home') }}" class="nav-btn">返回首页</a>
            <a href="{{ url_for('manage_scripts') }}" class="nav-btn">脚本管理</a>
            <a href="{{ url_for('manage_venvs') }}" class="nav-btn">虚拟环境管理</a>
        </div>
    </div>

    {% with messages = get_flashed_messages() %}
        {% if messages %}
        <ul class="flash-messages">
            {% for message in messages %}
            <li class="flash-message">{{ message }}</li>
            {% endfor %}
        </ul>
        {% endif %}
    {% endwith %}

    <div class="container">
        <div class="files-container">
            <div class="file-tree" role="tree" aria-label="文件树">
                {% macro render_tree_item(item) %}
                    {% if item.type == 'directory' %}
                        <div class="tree-directory">
                            <div class="directory-header">
                                <span class="directory-toggle"></span>
                                <span class="directory-name">{{ item.name }}</span>
                            </div>
                            <div class="directory-content">
                                {% for child in item.children %}
                                    {{ render_tree_item(child) }}
                                {% endfor %}
                            </div>
                        </div>
                    {% else %}
                        <div class="tree-file {% if item.is_main %}main-file{% endif %}"
                             data-script="{{ script_name }}"
                             data-file="{{ item.path }}"
                             role="treeitem"
                             aria-selected="false">
                            <span class="file-icon {% if item.is_python %}python-file{% endif %}"></span>
                            <span class="file-name">{{ item.name }}</span>
                            {% if item.is_main %}
                            <span class="main-badge">主文件</span>
                            {% endif %}
                        </div>
                    {% endif %}
                {% endmacro %}

                {% for item in file_tree %}
                    {{ render_tree_item(item) }}
                {% endfor %}
            </div>

            <div id="editorContainer" class="editor-container">
                <div class="editor-header">
                    <h3 id="currentFileName"></h3>
                    <div class="editor-actions">
                        <button id="saveButton" class="save-btn">保存</button>
                        <button id="setMainButton" class="set-main-btn" style="display: none;">设为主文件</button>
                    </div>
                </div>
                <label for="fileEditor" class="sr-only">文件内容编辑器</label>
                <textarea id="fileEditor" 
                         class="editor" 
                         aria-label="文件内容编辑器"
                         placeholder="选择一个文件开始编辑"></textarea>
            </div>
        </div>
    </div>

    <div id="statusMessage" class="status-message" role="alert" aria-live="polite"></div>

    <script src="{{ url_for('static', filename='js/manage-files.js') }}"></script>
</body>
</html> 